<template>
	<view class="page-share">
		<!-- 导航栏 开始 -->
		<view class="page-tab">
			<tab-nav :tab-cur="TabCur" :tab-list="tabList" :is-show-menu="false" @tabSelect="tabSelect" :cus-padding="32"></tab-nav>
		</view>
		<!-- 导航栏 结束 -->

		<!-- 内容 开始 -->
		<scroll-view scroll-y="true" @scrolltolower="scrolltolower" style="height: calc(100% - 90rpx)">
			<!-- 短视频 开始 -->
			<h-short-video-list :list="list" type="admin" v-if="TabCur===0" />
			<!-- 短视频 结束 -->
			<!-- 视频 开始 -->
			<h-short-video-list :list="list" v-if="TabCur===1" />
			<!-- 视频 结束 -->
		</scroll-view>
		<!-- 内容 结束 -->
	</view>
</template>

<script>
	import tabNav from '@/components/TabNav'
	import HShortVideoList from "@/components/HShortVideoList"
	import profileMixin from "@/mixins/profile"
	export default {
		mixins: [profileMixin],
		components: {
			tabNav,
			HShortVideoList
		},
		data() {
			return {
				TabCur: 0,
				videoData:{
					total:0
				},
				list:[],
				adminVideoData:{
					total:0
				},
				liveList: [],
				isMore: true,
				query: {
					page: 1,
					size: 10,
					collects_type: ""
				}
			};
		},
		computed: {
			tabList() {
				return [`短视频${this.adminVideoData.total}`, `视频${this.videoData.total}`]
			}
		},
		methods: {
			async tabSelect(index) {
				this.query.page=1
				switch (index) {
					case 0:
						this.adminVideoData = await this.getList(1);
						this.list=this.adminVideoData.data
						break;
					case 1:
						this.videoData = await this.getList(2);
						this.list=this.videoData.data
						break;
				}
				this.TabCur = index
			},
			async getList(collects_type) {
				this.query.collects_type = collects_type
				let query = this.$h.utils.deepClone(this.query)
				let {
					data
				} = await this.$h.api.userModel.getLikes(query)
				this.isMore = data.data.length === query.size
				return data
			},
			async scrolltolower() {
				if (this.isMore) {
					this.query.page++
					let data = await this.getList(this.TabCur)
					this.list = [...this.list, ...data.data]
				}
			},
		},
		onLoad() {
			this.$h.showLoading()
			Promise.all([this.getList(1), this.getList(2)]).then(res => {
				this.$h.hideLoading()
				this.adminVideoData = res[0]
				this.videoData = res[1]
				this.list=this.adminVideoData.data
			})
		}
	}
</script>
<style>
	page {
		height: 100%;
	}
</style>
<style lang="scss" scoped>
	.page-share {
		height: 100%;

		.cu-card {
			padding-top: 20rpx;

			.cu-item.custom-margin {
				margin: 20rpx;
				overflow: hidden;
			}
		}

		.cu-card.custom-card-video {
			.img-box {
				width: 200rpx;
				height: 160rpx;
				position: relative;
			}

			.text-content {
				height: initial;
				font-size: 26rpx;
				color: #343436;
				font-weight: 500;
			}

			.cu-avatar.custom-video-avatar {
				width: 50rpx;
				height: 50rpx;
			}
		}

		.content-list {
			height: 520rpx;

			.content-item {
				width: 100%;
				height: 100%;
				border-radius: 14rpx;
				overflow: hidden;
				position: relative;

				.cu-avatar.custom {
					width: 40rpx;
					height: 40rpx;
				}
			}
		}

		.cu-card.custom-card-short,
		.cu-card.custom-card-live {
			padding-top: 40rpx;
		}
	}
</style>
